<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <title>推广端-个人推广统计</title>
    <include file = "Public/html/header.html" />

</head>

<body>
<div class="container-fluid">
    <!-- Page Heading -->
    <form class="form-inline" method="post" action="{:U('Member/promoters')}">
        <div class="form-group">
            <label for="exampleInputName1">推广人列表</label>
            <select class="form-control" style="height: 35px;" name="store_parent_id" id="store_id">
                <option value="">请选择</option>
                <foreach name="storeList" item="s">
                    <option value="{$s.store_id}" <if condition="$search_arr['store_parent_id'] eq $s['store_id']">selected</if>>{$s.store_name}</option>
                </foreach>
            </select>
        </div>

        <div class="form-group">
            <label for="exampleInputName3">统计方式</label>
            <select class="form-control" style="height: 35px;" id="type" name="type">
                <option value="month" <if condition="$search_arr['type'] eq 'month'">selected</if> >按月统计</option>
                <option value="week"  <if condition="$search_arr['type'] eq 'week'">selected</if>>按周统计</option>
            </select>
        </div>
        <div <if condition="$search_arr['type'] eq 'week'">style="display: none"</if> class="form-group" id="month_to">
            <select class="form-control" style="height: 35px;" name="searchmonth_year">
                <foreach name="year_arr" item="v" key="k">
                    <option value="{$k}" <if condition="$search_arr['searchmonth_year'] eq $k">selected</if>>{$v}</option>
                </foreach>
            </select>
            <select class="form-control" style="height: 35px;" name="searchmonth_month">
                <foreach name="month_arr" item="v" key="k">
                    <option value="{$k}" <if condition="$search_arr['searchmonth_month'] eq $k">selected</if>>{$v}</option>
                </foreach>
            </select>
        </div>

        <div <if condition="$search_arr['type'] eq 'month' || $search_arr['type'] eq ''">style="display: none"</if> id="week_to"  class="form-group">
            <select class="form-control" style="height: 35px;" name="searchweek_year">
                <foreach name="year_arr" item="v" key="k">
                    <option value="{$k}" <if condition="$search_arr['week']['current_year'] eq $k">selected</if>>{$v}</option>
                </foreach>
            </select>
            <select class="form-control" style="height: 35px;" name="searchweek_month">
                <foreach name="month_arr" item="v" key="k">
                    <option value="{$k}" <if condition="$search_arr['week']['current_month'] eq $k">selected</if>>{$v}</option>
                </foreach>
            </select>
            <select class="form-control" style="height: 35px;" name="searchweek_week">
                <foreach name="week_arr" item="v" key="k">
                    <option value="{$v.key}" <if condition="$search_arr['week']['current_week'] eq $v['key']">selected</if>>{$v.val}</option>
                </foreach>
            </select>
        </div>


        <button type="submit" class="btn btn-success">查询</button>
        <a href="{:U('Member/promoters')}" class="btn btn-warning">清空</a>
    </form>

</div>
<div class="row">
    <div id="echartsDiv" style="width: 1200px;height:600px;margin-top: 50px;margin-left: 20px;"></div>
</div>
<script src="__PUBLIC__/home/js/jquery.min.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="__PUBLIC__/home/js/bootstrap.min.js"></script>
<script src="__PUBLIC__/home/js/alert.js"></script>
<script src="__PUBLIC__/home/js/layer/layer.js"></script>
<script src="__PUBLIC__/home/js/laydate/laydate.js"></script>
<script src="__PUBLIC__/home/js/echarts-all.js"></script>
<input type="hidden" value='{$stat_json}' name="stat_json">
<!-- iframe自适应高度 -->
</body>
<script type="text/javascript">

    //获取统计数据
    var stat_json = JSON.parse($("[name=stat_json]").val());
    var myChart = echarts.init(document.getElementById('echartsDiv'));

    option = {
        title: {
            // text: '某地区蒸发量和降水量',
            // subtext: '纯属虚构'
        },
        tooltip: {
            trigger: 'axis'
        },
        legend: {
            data: []
        },
        toolbox: {
            show: true,
            feature: {
                dataView: {show: true, readOnly: false},
                magicType: {show: true, type: ['line', 'bar']},
                restore: {show: true},
                saveAsImage: {show: true}
            }
        },
        calculable: true,
        xAxis:stat_json.xAxis,
        yAxis: [
            {
                type: 'value',

            }
        ],
        series: stat_json.series
    };
    myChart.setOption(option);

</script>
<script>

    $("#type").change(function(){
        var type = $(this).val();
        if(type == 'month'){
            $("#week_to").hide();
            $("#month_to").show();
        }else if(type == 'week'){
            $("#week_to").show();
            $("#month_to").hide();
        }
    })
    //更新周数组
    $("[name='searchweek_month']").change(function() {
        var year = $("[name='searchweek_year']").val();
        var month = $("[name='searchweek_month']").val();
        $("[name='searchweek_week']").html('');
        var url = "{:U('Member/getweekofmonth')}";
        $.post(url,{
            y:year,
            m:month
        },function(data){
            var res = JSON.parse(data)
            if (res != null) {
                for (var i = 0; i < res.length; i++) {
                    $("[name='searchweek_week']").append('<option value="' + res[i].key + '">' + res[i].val + '</option>');
                }
            }
        })
    });

    laydate.render({
        elem: '#test16'
        ,type: 'datetime'
    });
    laydate.render({
        elem: '#test17'
        ,type: 'datetime'
    });

</script>

</html>
